
import { EventEmitter } from '../common/event-emitter';
import { SpanProgress } from './progress/SpanProgress';
import { ProgressElementInterface } from './progress/ProgressElementInterface';
import { resolveTarget } from './helpers';

/**
 * 进度事件类型枚举
 */
export enum ProgressUIEvent {
    Update = 't1h0.progress.event.update'
}

/**
 * ProgressUI配置选项接口
 */
export interface ProgressUIOptions {
    /** 进度条挂载目标元素或选择器 */
    target: string | HTMLElement;
    /** 进度条元素实现类，默认为SpanProgress 实例 */
    progressElement?: ProgressElementInterface;
}

/**
 * 进度条UI管理器
 * 负责下载进度的可视化展示和用户交互
 */
export class ProgressUI extends EventEmitter {
    /** 进度条元素实例 */
    private __progressElement: ProgressElementInterface;

    /**
     * 创建进度条UI实例
     * @param {ProgressUIOptions} options - 配置选项
     * @param {ProgressElementInterface} options.progressElement - 自定义进度元素
     * @param {string | HTMLElement} options.target - 挂载目标元素或选择器
     */
    constructor(options: ProgressUIOptions) {
        super();
        // 解析目标元素
        const targetElement = resolveTarget(options.target);
        // 使用指定的进度条实现类或默认的SpanProgress
        this.__progressElement = options.progressElement || new SpanProgress();

        targetElement.appendChild(this.__progressElement.getElement());
        this.__bindEventListeners();
    }

    /**
     * 绑定事件监听器
     * @private
     */
    private __bindEventListeners(): void {
        this.on(ProgressUIEvent.Update, (data: { progress: number, params?: Record<string, any> }) => {
            this.__progressElement.updateState(data.progress, data.params);
        });
    }

    /**
     * 获取进度条DOM元素
     * @returns {HTMLElement}
     */
    getElement(): HTMLElement {
        return this.__progressElement.getElement();
    }
}